<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>测试考核</title>
    <link rel="stylesheet" href="./assets/css/text.css">
    <link rel="stylesheet" href="./assets/font/iconfont.css">
    <script src="./js/jquery-3.4.1.min.js"></script>
    <script src="./js/echarts.min.js"></script>
    
</head>

<body>
    <!-- 头部部分 -->
    <header>
        <div class="header-box middle clearfix">
            <div class="logo fl"></div>
            <div class="right_box fr">
                <em class="iconfont icon-shezhi1"></em>
                <em class="iconfont icon-xiaoxi"></em>
                <div class="log_out"></div>
            </div>
        </div>
    </header>
    <!-- 主体内容 -->
    <content>
        <div class="nav middle clearfix">
            <div class="nav-left fl">
                <span class="title1">Audience Overview</span>
                <span class="title2">Roseville, CA</span>
            </div>
            <div class="nav-right fr">
                <ul class="fl">
                    <li>
                        <a href="#">DASHBOARD</a>
                    </li>
                    <li>
                        <a href="#">PROJECTS</a>
                    </li>
                    <li>
                        <a href="#">CALENDAR</a>
                    </li>
                    <li>
                        <a href="#">MAILBOX</a>
                    </li>
                    <li>
                        <a href="#">SETTINGS</a>
                    </li>
                </ul>
            </div>
        </div>
        <div class="news middle clearfix">
            <div class="banner fl" id="box">
                <div class="screen">
                    <ul>
                        <li>
                            <img src="./images/banner1.png" alt="">
                        </li>
                        <li>
                            <img src="./images/banner2.png" alt="">
                        </li>
                        <li>
                            <img src="./images/banner3.png" alt="">
                        </li>
                        <li>
                            <img src="./images/banner4.png" alt="">
                        </li>
                        <li>
                            <img src="./images/banner5.png" alt="">
                        </li>
                    </ul>
                    <ol>
                        <!-- 动态创建的小方块，添加在这里，样式已经给写好了-->
                    </ol>
                </div>
                <!-- 箭头 -->
                <div id="arr">
                    <span id="left">&lt;</span>
                    <span id="right">&gt;</span>
                </div>
            </div>
            <div class="lists fr">
                <div class="list-top">
                    <span class="fl">Support Requests</span>
                    <div class="view-all fr">View All</div>
                </div>
                <div class="list-content">
                    <div class="div-th clearfix">
                        <ul>
                            <li>TIME</li>
                            <li>USER NAME</li>
                            <li>STATUS</li>
                        </ul>
                    </div>
                    <div class="div-td1  clearfix">
                        <ul>
                            <li>9:45pm</li>
                            <li>info@design.com</li>
                            <li>
                                <a href="#">Solved</a>
                            </li>
                        </ul>
                    </div>
                    <div class="div-td2  clearfix">
                        <ul>
                            <li>9:45pm</li>
                            <li>info@design.com</li>
                            <li>
                                <a href="#">Solved</a>
                            </li>
                        </ul>
                    </div>
                </div>

            </div>
        </div>
        <!-- 曲线图数据展示 -->
        <div class="curve middle">
            <div id="main"></div>
        </div>
        <!-- 饼状和柱状统计图 -->
        <div class="week middle clearfix">
            <div class="week-one fl">
                <div id="pie"></div>
            </div>
            <div class="week-two fr">
                <div id="columnar"></div>
            </div>
        </div>
    </content>
    <!-- 页尾部分 -->
    <footer>
        <div class="footer_web middle clearfix">
            <div class="logo fl"></div>
            <div class="footer-links clearfix">
                <dl>
                    <dt>NEWS</dt>
                    <dd>
                        <a href="#">CHANNELS</a>
                    </dd>
                    <dd>
                        <a href="#">OVERVIEW</a>
                    </dd>
                    <dd>
                        <a href="#">TIMELINE</a>
                    </dd>
                </dl>
                <dl>
                    <dt>SPORT</dt>
                    <dd>
                        <a href="#">CULTURE</a>
                    </dd>
                    <dd>
                        <a href="#">NATURE</a>
                    </dd>
                    <dd>
                        <a href="#">MUSIC</a>
                    </dd>
                </dl>
                <dl>
                    <dt>WEATHER</dt>
                    <dd>
                        <a href="#">AUTOS</a>
                    </dd>
                    <dd>
                        <a href="#">LOCAL</a>
                    </dd>
                    <dd>
                        <a href="#">SHOP</a>
                    </dd>
                </dl>
                <dl>
                    <dt>FUTURE</dt>
                    <dd>
                        <a href="#">FOOD</a>
                    </dd>
                    <dd>
                        <a href="#">EARTH</a>
                    </dd>
                    <dd>
                        <a href="#">TV</a>
                    </dd>
                </dl>
                <dl>
                    <dt>TRAVEL</dt>
                    <dd>
                        <a href="#">RADIO</a>
                    </dd>
                </dl>
            </div>
        </div>
    </footer>

</body>
<script src="js/index.js"></script>
</html>